import React from 'react'
import {Piece} from './Piece'
import {checkerboardStates} from "../types/Checkerboard";
import './Checkerboard.css'
interface isProps {
    checkerboardList:checkerboardStates
    onClick:(e:any)=>any
}
export class Checkerboard extends React.Component<isProps>{
    render() {
        let arr:JSX.Element[] = []
        this.props.checkerboardList.forEach((item,index)=>{
            arr.push( <Piece status={item} key={index} onClick={()=>{
                this.props.onClick(index)
            }
            }/>)
        })
        return <div className="Checkerboard">
            {arr}
        </div>
    }



}
